<template>
	<view class="mine">
		<!-- 头像 -->
		<view class="header">
			<view class="header_left">
				<image :src="userInfo.avatarUrl" class="photo_img"></image>
				<view class="news">
					<view class="userName" v-if="loginFlag">{{userInfo.userName}}</view>
					<view class="tel" v-if="loginFlag">{{userInfo.telPhone}}</view>
					<text v-if="!loginFlag" @click="getuserinfo">请点击登录</text>
				</view>
			</view>
			<view class="change_news" v-if="loginFlag"  @click="toEdit">
				<image class="img" src="../../static/first/edit.png"></image>
			</view>
		</view>
		<!-- nav -->
		<view class="nav_choose">
			<view class="ser_record" @tap="toRecord()">
				<image src="../../static/mine/record.png"></image>
				<view>服务记录</view>
			</view>
			<view class="ser_record" @tap="toEnterprise()">
				<image src="../../static/mine/2.png"></image>
				<view>企业信息</view>
			</view>
			<view class="ser_record" @tap="toMyLive()">
				<image src="../../static/mine/3.png"></image>
				<view>我的收藏</view>
			</view>
		</view>
		<!--  -->
		<view class="empty"></view>
		<!--  -->
		<view class="find">
			<view class="change_tel" @click="changePhone">
				<view class="change_left">
					<image src="../../static/mine/phone.png" mode="aspectFit"></image>
					<view>更换手机号</view>
				</view>
				<view class="change_right">
					<view>{{userInfo.telPhone}}</view>
					<image src="../../static/first/right.png"></image>
				</view>
			</view>
			<view class="change_tel" @click="toPassword">
				<view class="change_left">
					<image src="../../static/mine/password.png" mode="aspectFit"></image>
					<view>修改密码</view>
				</view>
				<view class="change_right">
					<image src="../../static/first/right.png"></image>
				</view>
			</view>
			<view class="change_tel">
				<view class="change_left">
					<image src="../../static/mine/read.png" mode="aspectFit"></image>
					<view>操作指南</view>
				</view>
				<view class="change_right">
					<image src="../../static/first/right.png"></image>
				</view>
			</view>
			<view class="change_tel" @click="toSugguset">
				<view class="change_left">
					<image src="../../static/mine/fankui.png" mode="aspectFit"></image>
					<view>意见反馈</view>
				</view>
				<view class="change_right">
					<image src="../../static/first/right.png"></image>
				</view>
			</view>
			<view class="change_tel" @click="toContact">
				<view class="change_left">
					<image src="../../static/mine/contact.png" mode="aspectFit"></image>
					<view>联系我们</view>
				</view>
				<view class="change_right">
					<image src="../../static/first/right.png"></image>
				</view>
			</view>
		</view>
		<!--  -->
		<button v-if="loginFlag" type="default" class="toGoLogin" @click="loginOut">退出登录</button>
	</view>
</template>

<script>
	import utils from '../../common/utils.js'
	export default {
		data() {
			return {
				loginFlag: false,
				userInfo: {
					userName: '',
					telPhone: '',
					avatarUrl: ''
				},
				flag: false
			}
		},
		onShow() {
			let userInfo = uni.getStorageSync('userInfo')
			if (userInfo != '') {
				this.userInfo.userName = userInfo.nickName
				this.userInfo.telPhone = userInfo.phoneNumber
				this.userInfo.avatarUrl = userInfo.avatarUrl
				this.loginFlag = true
			} else {
				this.loginFlag = false
			}
		},
		onLoad() {
			let userInfo = uni.getStorageSync('userInfo')
			if (userInfo != '') {
				this.getMyEnterprise()
			}
		},
		methods: {
			//跳转企业信息
			toEnterprise() {
				if (this.iSloginFlag()) {
					if (this.flag == true) {
						uni.navigateTo({
							url: "/pages/mine/myCompany"
						})
					} else {
						uni.navigateTo({
							url: "/pages/mine/enterprise"
						})
					}
				}
			},
			//跳转服务记录
			toRecord() {
				if (this.iSloginFlag()) {
					uni.navigateTo({
						url: '/pages/mine/record'
					})
				}
			},
			//我的收藏
			toMyLive() {
				if (this.iSloginFlag()) {
					uni.navigateTo({
						url: '/pages/mine/collection'
					})
				}
			},
			//登录
			getuserinfo() {
				let that = this
				uni.getUserProfile({
					desc: 'wexin',
					success: (e) => {
						utils.loginRequest(e.userInfo).then((res) => {
							if (res.success) {
								if (uni.getStorageSync('userInfo') != '') {
									let userInfo = uni.getStorageSync('userInfo')
									that.userInfo.avatarUrl = userInfo.avatarUrl
									that.userInfo.userName = userInfo.nickName
									that.userInfo.telPhone = userInfo.phoneNumber
									this.loginFlag = true
									uni.showToast({
										title: '登录成功',
										icon: 'none'
									})
								}
							}
						})
					}
				})
			},
			//判断是否登录
			iSloginFlag() {
				let userInfo = uni.getStorageSync('userInfo')
				if (userInfo == '') {
					uni.showToast({
						title: '请先登录',
						icon: 'none'
					})
					return false
				} else {
					return true
				}
			},
			//意见反馈
			toSugguset() {
				uni.navigateTo({
					url: '/pages/mine/sugguset'
				})
			},
			//联系我们
			toContact() {
				uni.navigateTo({
					url: '/pages/mine/contact'
				})
			},
			//修改密码
			toPassword() {
				if (this.iSloginFlag()) {
					uni.navigateTo({
						url: '/pages/mine/changePsw_two'
					})
				}
			},
			//修改手机号
			changePhone() {
				if (this.iSloginFlag()) {
					uni.navigateTo({
						url: '/pages/mine/changePhone'
					})
				}
			},
			//退出登录
			loginOut() {
				let that = this
				uni.showModal({
					title: '退出登录',
					content: '确定要退出登录吗',
					success: function(res) {
						if (res.confirm) {
							uni.removeStorageSync('userInfo')
							that.userInfo.avatarUrl = ''
							that.userInfo.telPhone = ''
							uni.switchTab({
								url: '/pages/home/home'
							})
						}
					}
				})
			},
			//获取我的企业信息
			getMyEnterprise() {
				let userInfo = uni.getStorageSync('userInfo')
				uni.request({
					url: this.$serverUrl + 'ftEnterprise',
					data: {
						"userId": userInfo.id
					},
					success: (res) => {
						let data = res.data.content
						if (data.length > 0) {
							this.flag = true
						} else {
							this.flag = false
						}
					},
					fail: (e) => {
						this.showToast('关联公司信息获取失败')
					}
				})
			},
			//跳转修改内容页面
			toEdit() {
				if (this.iSloginFlag()) {
					uni.navigateTo({
						url: '/pages/mine/person'
					})
				}
			}
		}
	}
</script>

<style scoped lang="scss">
	.img {
		width: 70rpx;
		height: 70rpx;
	}

	.header {
		margin: 36upx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.photo_img {
		width: 132upx;
		height: 132upx;
		background-color: #C0C0C0;
		border-radius: 50%;
	}

	.header_left {
		display: flex;
		align-items: center;
	}

	.news {
		margin-left: 36upx;
		line-height: 50upx;
	}

	.tel {
		color: #999999;
	}

	.userName {
		font-weight: bold;
	}

	.nav_choose {
		margin: 52upx 100upx;
		display: flex;
		justify-content: space-between;
	}

	.ser_record {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

	.ser_record image {
		width: 88upx;
		height: 88upx;
	}

	.ser_record view {
		margin-top: 20upx;
		color: #333333;
		font-size: 13px;
	}

	// empty
	.empty {
		width: 100%;
		height: 18upx;
		background-color: #F5F5F5;
	}

	// find
	.change_tel {
		height: 124upx;
		// background-color: #4CD964;
		display: flex;
		padding-left: 36upx;
		padding-right: 36upx;
		justify-content: space-between;
	}

	.change_left {
		display: flex;
		align-items: center;
	}

	.change_left image {
		width: 52upx;
		height: 52upx;
	}

	.change_left view {
		font-size: 15px;
		color: #333333;
		margin-left: 36upx;
	}

	.change_right {
		display: flex;
		align-items: center;
	}

	.change_right image {
		width: 28upx;
		height: 28upx;
		margin-left: 16upx;
	}

	.change_right view {
		font-size: 28upx;
		color: #666666;
	}

	// 
	.toGoLogin {
		margin: 88upx 36upx;
		font-size: 16px;
		background-color: #F5F5F5;
	}
</style>
